import { ref, computed } from 'vue'

export function useNumberInput(initialValue: number = 0) {
  const rawValue = ref(initialValue)
  
  const formattedValue = computed({
    get: () => rawValue.value,
    set: (val: number | string) => {
      const num = Number(val)
      if (isNaN(num)) return
      if (num < 0) return
      if (num > 9999) return
      rawValue.value = num
    }
  })

  const increment = () => {
    if (rawValue.value < 9999) {
      rawValue.value++
    }
  }

  const decrement = () => {
    if (rawValue.value > 0) {
      rawValue.value--
    }
  }

  return {
    value: formattedValue,
    increment,
    decrement
  }
} 